/**
 * SPDX-FileCopyrightText: 2023-2025 Sangfor Technologies Inc.
 * SPDX-License-Identifier: Mulan PSL v2
 */
<template>
    <div class="radio-button-group">
        <slot></slot>
    </div>
</template>

<style lang="stylus">
    .radio-button-group
        display: inline-block;
        border: solid 1px #CCC;
        height: 28px;
        line-height: 28px;
        vertical-align: middle

        .sfv-btn
            background: #FFF;
            color: #18c1c6;
            float: left;
            min-width: auto;
            border: none;
            border-radius: 0;
            height: 26px;
            line-height: 26px;

            &.sfv-btn-selected
                background: #3c434b;
                color: #FFF;

</style>

<script>

/**
 * Created by ued on 2017/1/12.
 */

import SfVueComponent from '@sxf/sf-vue-component';
import logger from 'src/util/logger';

export default {

    mixins: [
        SfVueComponent.Component,
        SfVueComponent.JsonField
    ],

    data () {
        return {};
    },

    mounted () {
        this.valueMap = new Map();
        this.$children.forEach((button) => {
            let value = button.$el.value;
            if (!value) {
                logger.error('[radio_button_group] value required', button);
                return;
            }
            this.valueMap.set(value, button);

            button.$on('click', this._creageToggleHandle(button));
        });
        if (this.value) {
            this.select(this.value);
        }
    },

    methods: {

        _creageToggleHandle (button) {
            let me = this;
            return function (event) {
                me._toggle(button.$el.value, event);
            };
        },

        _toggle (value) {
            this.$children.forEach(button => button.selected = button.$el.value === value);
            this.onInput(value);
        },

        select (value) {
            this._toggle(value);
        }
    },

    watch: {
        value (v) {
            this.select(v);
        }
    }
};
</script>
